<template>
    <section class="circle-top">
        <div class="container" v-for="i in toplist" :key="i.id">
            <div class="circle-left">
                <p>最新 <span>{{i.num}}</span>条信息</p>
                <p>一共 <span>{{i.altogether}}</span>条信息</p>
            </div>
            <div class="circle-center">
                <p>热点推送：徐州第四人民医院整形专科春节特惠，双眼皮整形<b>288</b>元预约中！</p>
                <span>更多推送 ></span>
            </div>
            <div class="circle-right" v-if="i.type!==1">
                <span><Icon type="md-star" class="icon"/>看精华</span>
                <span><Icon type="md-time" class="icon"/>时间排序</span>
                <span><Icon type="ios-book" class="icon"/>快速翻页</span>
            </div>
        </div>
    </section>
</template>

<script>
    export default {
        name: "Cricle-top",
        props:['toplist']
    }
</script>

<style scoped lang="less">
  .circle-top{
      height: 48px;
      line-height: 48px;
      border: 1px solid #dadada;
      margin-bottom: 30px;
      .circle-left{
          float: left;
       width: 270px;
          p{
              width: 50%;
              float: left;
              color: #666666;
              span{
                  color: #ff5371;
                  padding: 0 5px 0 5px;
              }
          }
      }
      .circle-center{
          float: left;
          width: 630px;
        p{
            color: #000000;
            font-size: 14px;
            text-align: center;
            width: 88%;
            float: left;
            b{
                color: #ff0000;
            }
        }
          span{
              float: right;
              color: #ff5371;
              font-size: 14px;
          }
      }
      .circle-right{
          width: 270px;
          float: left;
          text-align: center;
          padding-left: 25px;
          >:last-child{
              padding-right: 0px;
          }
          span{
              color: #666666;
              font-size: 13px;
              padding-right: 20px;
          }
          .icon{
              color: #FE5371;
              font-size: 20px;
              margin-top: -4px;
          }
      }
  }
</style>